{# SPDX-FileCopyrightText: © 2014-2018 Siemens AG

   SPDX-License-Identifier: FSFAP
#}
{% extends "include/base.html.twig" %}
{% block styles %}
  {{ parent() }}
  <link rel="stylesheet" href="css/highlights.css"/>
  <link rel="stylesheet" href="css/spasht.css"/>
{% endblock %}

{% block content %}
  <div id="leftrightalignment" name="leftrightalignment">
    <table border="0" style="padding:0px; height:100%; width:100%">
      <tr>
        <td style="padding:0px; position:relative; height: 100%; width:50%">
          <div class="centered" style='padding:2px;'>
            {{ pageMenu }}
            <button class="legendHider btn btn-default btn-sm">
              {{ 'Hide Legend'| trans }}
            </button>
            <button class="legendShower btn btn-default btn-sm">
              {{ 'Show Legend'| trans }}
            </button>
          </div>
          <div class="boxnew" style="overflow:scroll;">{{ textView }}</div>
          <div id="legendBox" name="legendBox" style="background-color:white; padding:2px; border:1px outset #222222; width:150px; position:absolute; right:17px; bottom:17px; ">
            <u><b>{{ 'Legend:'| trans }}</b></u><br/>
              {% for entry in legendData %}
                <span style="{{ entry.style }}" class="{{ entry.class }}">{{ entry.text }}</span><br/>
              {% endfor %}
          </div>
        </td>
        <td class="headerBox" style="min-width:100%;min-height:100%;">
          {% block rhs %}
            {% include 'ui-clearing-view_rhs.html.twig' %}
          {% endblock %}
        </td>
      </tr>
    </table>
  </div>
{% endblock %}


{% block foot %}
  {{ parent() }}

  <script src="scripts/jquery.dataTables.min.js" type="text/javascript"></script>
  <script src="scripts/jquery.dataTables.editable.js" type="text/javascript"></script>
  <script src="scripts/jquery.jeditable.js" type="text/javascript"></script>
  <script src="scripts/jquery.validate.js" type="text/javascript"></script>
  <script src="scripts/job-queue-poll.js" type="text/javascript"></script>
  <script src="scripts/change-license-common.js" type="text/javascript"></script>
  <script src="scripts/change-license-view.js" type="text/javascript"></script>
  <script src="scripts/legend.js" type="text/javascript"></script>
  <script src="scripts/tools.js" type="text/javascript"></script>
  <script src="scripts/ui-clearing-view_bulk.js" type="text/javascript"></script>
  <script type="text/javascript">{% include "ui-clearing-view.js.twig" %}</script>
  <script type="text/javascript">{% include "bulk-history.js.twig" %}</script>
  <script type="text/javascript">{% include "next-options.js.twig" %}</script>
{% endblock %}
